<!DOCTYPE html>
<html style="height: 100%;width: 100%; ">
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <title>用户主界面</title>
        </head>
        <script src="/approval/static/js/jquery-3.4.1.min.js"></script>
        <script src="/approval/static/js/vue-2.4.0.js"></script>
        <link type="text/css" rel="stylesheet" href="/approval/static/css/bootstrap.min.css"/>

        <body style="height: 100%;width: 100%;margin-left: 0px;margin-top: 0px;">
        <!-- Stack the columns on mobile by making one full-width and the other half-width -->
        <div id="app" class="container-fluid" style="height: 100%">
        <div class="row row-no-gutters" style="height: 15%">
            <div class="col-xs-12 col-md-12" align="center" style="height: 100%">
                <div class="panel panel-default" style="margin: 0px;padding: 0px;height: 100%">

                    <div class="panel-body text-center"  style="margin: 0px;padding: 0px;height: 70%">
                       <h1 class="text-info">{{title}}</h1>
                    </div>
                    <div class="panel-footer text-right" style="height: 30%;padding: 0px">
                        <button type="button" class="btn btn-danger btn-xs"  @click="bt_exit">退出</button>

                    </div>
                </div>
            </div>

        </div>

        <!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop -->


        <!-- Columns are always 50% wide, on mobile and desktop -->
        <div class="row row-no-gutters" style="height: 85%">
            <div class="col-xs-2 border-left-1" style="height: 100%">
                <div class="panel panel-default" style="margin: 0px;padding: 0px;height: 100%">

                    <div class="panel-body text-center"  style="margin: 0px;padding: 0px;height: 100%">
                       <iframe name="left" v-bind:src="left" width="100%" height="100%" scrolling="no">

                       </iframe>
                    </div>

                </div>
            </div>
            <div class="col-xs-10" style="height: 100%">
                <div class="panel panel-default" style="margin: 0px;padding: 0px;height: 100%">

                    <div class="panel-body text-center"  style="margin: 0px;padding: 0px;height: 100%">
                        <iframe scrolling="no" name="right" v-bind:src="right" width="100%" height="100%" >

                        </iframe>
                    </div>

                </div>
            </div>
        </div>
        </div>
        <script>
            function getAuthro(){
                var flag=false;
                $.ajax(
                    {
                        url:"/approval/certificate/IsLogin",
                        type:"GET",
                        async:false,
                        dataType:"text",
                        success:function (response){

                            alert("获取认证" +response)
                            if (response==="false"){

                                alert("没有你的登录信息，将会自动跳转到登录界面");
                                window.location="/approval/static/html/SignIn.html";

                            }else {
                                flag=true;
                                sessionStorage.setItem("account",response);
                                alert("已登录，更换用户就点击退出");
                            }

                        }
                    })
                return flag;
            }
            $(document).ready(function (){
                 var flag=getAuthro();
                 var number=Math.random()*1000;
                alert("认证函数执行完毕"+flag);
                 if (flag==true){
                     var s=sessionStorage.getItem("account");
                     alert("本地拉取用户信息"+s);
                     var app=new Vue({
                         el:"#app",
                         data:{
                             title:"欢迎来到此系统",
                             account:s,
                             left:"",
                             right:""

                         },
                         methods:{
                             bt_exit:function (){
                                 alert("退出按钮点击");
                                 sessionStorage.clear();
                                 $.ajax({
                                     url:"/approval/certificate/exit",
                                     type: "GET",
                                     dataType: "text",
                                     success:function (res){
                                         if (res=="true"){
                                             alert("退出成功，跳转登录界面");
                                             window.location="/approval/static/html/SignIn.html"
                                         }else {
                                             alert("退出失败");
                                         }
                                     }
                                 })
                             }
                         },
                         mounted:function (){
                             alert("目前获取的data中的数据"+this.account);
                             this.left="/approval/certificate/getLeft?account="+this.account+"&number="+number;
                         }

                     })
                 }




            })
        </script>
        </body>
</html>
